<template>
	<el-dialog title="企业信息" v-model="isShowDialog" width="800px" :close-on-click-modal="false"
		:close-on-press-escape="false">
		<el-row :gutter="20" v-for="(field,index) in fields">
			<el-col :span="4" style="text-align: right;" class="mb20">
				{{field}}
			</el-col>
			<el-col :span="20" class="mb20">
				<img :src="ruleForm[index]" style="max-width:90%"
					v-if="index==='LicensePicture' || index==='IDface' ||  index==='IDback'" />
				<span v-else-if="index==='Status'">
					<span v-if="ruleForm[index]===0"> 修改中</span>
					<span v-else-if="ruleForm[index]===1"> 待审核</span>
					<span v-else-if="ruleForm[index]===2"> 通过审核</span>
					<span v-else-if="ruleForm[index]===3"> 未通过审核</span>
				</span>
				<span v-else>
					{{ruleForm[index]}}
				</span>
			</el-col>
		</el-row>
		<template #footer>
			<span class="dialog-footer">
				<el-button @click="onCancel">关 闭</el-button>
			</span>
		</template>
	</el-dialog>
</template>

<script lang="ts">
	import {
		reactive,
		toRefs,
		onMounted,
		ref,
	} from 'vue';
	export default {
		name: 'UserForm',
		setup() {

			const state = reactive({
				isShowDialog: false,
				ruleForm: {
					ID: '0',
					MembersID: '0',
					Name: '',
					AreaID: '',
					Addrees: '',
					Representative: '',
					LicenseNo: '',
					LicensePicture: '',
					IDface: '',
					IDback: '',
					LinkmanName: '',
					LinkmanPhone: '',
					Bank: '',
					TaxNo: '',
					lng: '',
					lat: '',
				},
				fields: {
					Nickname: '会员昵称',
					Name: '企业名称',
					Representative: '代表人',
					LicenseNo: '营业执照号',
					LicensePicture: '营业执照图片',
					IDface: '身份证正面',
					IDback: '身份证反面',
					LinkmanName: '联系人名称',
					LinkmanPhone: '联系人手机',
					Bank: '开户银行',
					TaxNo: '企业税号',
					FullArea: '地区',
					lng: '经度',
					lat: '纬度',
					Status: '审核状态',
				}
			});
			// 打开弹窗
			const openDialog = (model: Object, callback: Function) => {
				state.ruleForm = model;
				state.isShowDialog = true;
				state.callback = callback;
			};
			// 关闭弹窗
			const closeDialog = () => {
				state.isShowDialog = false;
			};
			// 取消
			const onCancel = () => {
				closeDialog();
			};

			// 页面加载时
			onMounted(() => {

			});

			return {
				openDialog,
				closeDialog,
				onCancel,

				...toRefs(state),
			};
		},
	};
</script>
